import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";
import { resolve } from "path";
import vueJsx from "@vitejs/plugin-vue-jsx";
import Components from "unplugin-vue-components/vite";
import { VantResolver } from "unplugin-vue-components/resolvers";
import postCssPxToRem from "postcss-pxtorem";

export default ({ mode }) =>
	defineConfig({
		plugins: [
			vue(),
			vueJsx(),
			Components({
				resolvers: [VantResolver()],
			}),
		],
		resolve: {
			alias: {
				"~utils": "/src/utils",
				"~/": "/src/",
				"~service": "/src/service/",
				"~components": "/src/components/",
				"~shared": "/src/utils/shared/",
			},
		},
		envDir: "./",
		// 设置打包路径
		base: loadEnv(mode, process.cwd()).VITE_APP_PREFIX,
		server: {
			// 设置服务启动端口号
			port: 8000,
			open: true,
			host: "0.0.0.0",
			cors: true,
			// 设置代理，根据我们项目实际情况配置
			proxy: {
				// 浏览端服务代理
				"/trade": {
					target: loadEnv(mode, process.cwd()).VITE_APP_BASE_URL,
					// target: "http://10.162.20.184:8081",
					changeOrigin: true,
					secure: false,
				},
			},
		},
		css: {
			postcss: {
				plugins: [
					postCssPxToRem({
						rootValue: 37.5,
						propList: ["*"],
					}),
				],
			},
			preprocessorOptions: {
				less: {
					additionalData: `@import "${resolve(
						__dirname,
						"src/style/var.less"
					)}";`,
					javascriptEnabled: true,
				},
			},
		},
	});
